<a href="http://github.com/angular/angular.js/tree/v1.2.9/src/ng/compile.js#L1928" class="view-source btn btn-action"><i class="icon-zoom-in"> </i> View source</a><a href="http://github.com/angular/angular.js/edit/master/src/ng/compile.js" class="improve-docs btn btn-primary"><i class="icon-edit"> </i> Improve this doc</a><h1><code ng:non-bindable="">Attributes</code>
<div><span class="hint">type in module <code ng:non-bindable="">ng</code>
</span>
</div>
</h1>
<div><h2 id="description">Description</h2>
<div class="description"><div class="ng-compile-directive-attributes-page"><p>A shared object between directive compile / linking functions which contains normalized DOM
element attributes. The values reflect current binding state <code>{{ }}</code>. The normalization is
needed since all of these are treated as equivalent in Angular:</p>
<p>   <span ng:bind="a" ng-bind="a" data-ng-bind="a" x-ng-bind="a"></p>
</div></div>
<div class="member method"><h2 id="methods">Methods</h2>
<ul class="methods"><li><h3 id="methods_$addclass">$addClass(classVal)</h3>
<div class="$addclass"><div class="ng-compile-directive-attributes-addclass-page"><p>Adds the CSS class value specified by the classVal parameter to the element. If animations
are enabled then an animation will be triggered for the class addition.</p>
</div><h5 id="methods_$addclass_parameters">Parameters</h5><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>classVal</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-addclass-page"><p>The className value that will be added to the element</p>
</div></td></tr></tbody></table></div>
</li>
<li><h3 id="methods_$observe">$observe(key, fn)</h3>
<div class="$observe"><div class="ng-compile-directive-attributes-observe-page"><p>Observes an interpolated attribute.</p>
<p>The observer function will be invoked once during the next <code>$digest</code> following
compilation. The observer is then invoked whenever the interpolated value
changes.</p>
</div><h5 id="methods_$observe_parameters">Parameters</h5><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>key</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-observe-page"><p>Normalized key. (ie ngAttribute) .</p>
</div></td></tr><tr><td>fn</td><td><a href="" class="label type-hint type-hint-function">function(interpolatedValue</a></td><td><div class="ng-compile-directive-attributes-observe-page"><p>Function that will be called whenever
the interpolated value of the attribute changes.
See the <a href="guide/directive#attributes">Directives</a> guide for more info.</p>
</div></td></tr></tbody></table><h5 id="methods_$observe_returns">Returns</h5><table class="variables-matrix"><tr><td><a href="" class="label type-hint type-hint-function">function()</a></td><td><div class="ng-compile-directive-attributes-observe-page"><p>the <code>fn</code> parameter.</p>
</div></td></tr></table></div>
</li>
<li><h3 id="methods_$removeclass">$removeClass(classVal)</h3>
<div class="$removeclass"><div class="ng-compile-directive-attributes-removeclass-page"><p>Removes the CSS class value specified by the classVal parameter from the element. If
animations are enabled then an animation will be triggered for the class removal.</p>
</div><h5 id="methods_$removeclass_parameters">Parameters</h5><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>classVal</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-removeclass-page"><p>The className value that will be removed from the element</p>
</div></td></tr></tbody></table></div>
</li>
<li><h3 id="methods_$set">$set(name, value)</h3>
<div class="$set"><div class="ng-compile-directive-attributes-set-page"><p>Set DOM element attribute value.</p>
</div><h5 id="methods_$set_parameters">Parameters</h5><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>name</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-set-page"><p>Normalized element attribute name of the property to modify. The name is
reverse-translated using the <a href="api/ng.$compile.directive.Attributes#$attr"><code>$attr</code></a>
property to the original name.</p>
</div></td></tr><tr><td>value</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-set-page"><p>Value to set the attribute to. The value can be an interpolated string.</p>
</div></td></tr></tbody></table></div>
</li>
<li><h3 id="methods_$updateclass">$updateClass(newClasses, oldClasses)</h3>
<div class="$updateclass"><div class="ng-compile-directive-attributes-updateclass-page"><p>Adds and removes the appropriate CSS class values to the element based on the difference
between the new and old CSS class values (specified as newClasses and oldClasses).</p>
</div><h5 id="methods_$updateclass_parameters">Parameters</h5><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>newClasses</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-updateclass-page"><p>The current CSS className value</p>
</div></td></tr><tr><td>oldClasses</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-compile-directive-attributes-updateclass-page"><p>The former CSS className value</p>
</div></td></tr></tbody></table></div>
</li>
</ul>
</div>
<div class="member property"><h2 id="properties">Properties</h2>
<ul class="properties"><li><h3 id="properties_$attr">$attr</h3>
<div class="$attr"><h5 id="properties_$attr_returns">Returns</h5><table class="variables-matrix"><tr><td><a href="" class="label type-hint type-hint-object">object</a></td><td><div class="ng-compile-directive-attributes-attr-page"><p>A map of DOM element attribute names to the normalized name. This is
needed to do reverse lookup from normalized name back to actual name.</p>
</div></td></tr></table></div>
</li>
</ul>
</div>
</div>
